<style  scoped>
.videoList{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  margin-left: 6%;
  margin-top: 2%;
  margin-right: 100px;
}
.videoList > div {
  width: calc(29% + 15px); /* 每个视频组件占据父容器的 30% 宽度，并考虑间距 */
}
</style>
<template>
  <div class="videoList">
    <div v-for="item in videoList" :key="item.id">
      <VideoComponent :video = item ></VideoComponent>
    </div>
  </div>
</template>
<script>

import VideoComponent from "@/components/video/VideoComponent.vue";
import {getVideoList} from "@/api/video/video";

export default {
  created() {
    this.VideoList();
  },
  methods:{
   VideoList(){
     getVideoList().then(
       res =>{
         this.videoList = res.data
         console.log(res.data)
       }
     )
   }
  },
  data(){
     return{
       videoList:[
       ]
     }
  },
  components: {VideoComponent}
}
</script>

